<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>


<html>
	<head>
		<base href="<%=basePath%>"/>
		
		<title>海峰影院&nbsp;&nbsp;个人首页</title>
		<meta http-equiv="pragma" content="no-cache"/>
		<meta http-equiv="cache-control" content="no-cache"/>
		<meta http-equiv="expires" content="0"/>

		<link rel="stylesheet" type="text/css" href="css/global.css"/>
		<link rel="stylesheet" type="text/css" href="css/memberCenter.css"/>
		<link rel="stylesheet" type="text/css" href="css/head.css"/>
		<link rel="stylesheet" type="text/css" href="css/footer.css"/>

		<script type="text/javascript" src="js/jquery-1.6.1.js"></script>
		<script type="text/javascript" src="js/common.js"></script>
		<script type="text/javascript" src="js/memberCenter.js"></script>
		<link rel="stylesheet" type="text/css" href="easyui/themes/gray/easyui.css" />
		<script type="text/javascript" src="easyui/jquery.min.js"></script>
		<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
		<script type="text/javascript" src="js/json.js"></script>
		<script type="text/javascript"> 
			var json ='${json}';
			var objs = eval("("+json+")");
			$(function(){
				$("#emailText").html(objs.email);
				$("#name").val(objs.name);
				if(objs.phone=="null"){
					$("#phone").val(" ");
				}else{
				$("#phone").val(objs.phone);
				}
				if(objs.gender==1){
					$("input:radio:first").attr("checked","checked");
				}else{
					$("input:radio:last").attr("checked","checked");
				}
				
				$("#id").val(objs.ID);
			});
			
			function updateMember(){
				var name = $("#name").val();
				var gender = $("input:radio:checked").val();
				var phone = $("#phone").val();
				
				var phoneTest=/^1[3|4|5|7|8][0-9]{9}$/;
				if(!phoneTest.test(phone)){
					alert("手机号格式错误！");
					return;
				}
	
				if(!name||!phone){
					alert("不能为空！");
					return;
				}
				var args = {name : name, gender : gender , phone : phone,memberId : objs.ID};
				var param = {reqData : args , reqUrl : "update"};
				ajaxRequest(param, function(returnData){
					if(returnData.Data == "true"){
						alert("修改成功！");
						return;
					}else{
						alert("修改失败！");
						return;
					};
				},null);
			}
			function updatePwd(){
				var memberPwd = $("#pwd").val();
				var newPwd = $("#newpwd").val();
				var truePwd = $("#truepwd").val();
				
				if(!memberPwd||!newPwd||!truePwd){
					alert("不能为空！");
					return;
				}
				if(newPwd.length>20||6>newPwd.length){
					alert("新密码长度不符合要求！");
					return;
				}
				if(newPwd!=truePwd){
					alert("确认密码不一致！");
					return;
				}
				var args = {memberPwd : memberPwd, truePwd : truePwd , memberId : objs.ID};
				var param = {reqData : args , reqUrl : "SeePwd"};
				
				ajaxRequest(param, function(returnData){
					if(memberPwd==returnData.memberPwd){
						location = "ChangePwd?id="+objs.ID+"&truePwd="+truePwd;
						
					}else{
						$("#pwdText").text("密码错误！");
					};
				},null);
			}
			
			function test(){
				$("#submit").click();
			}
		</script>
		<%
			Object adressPhoto = request.getAttribute("adressPhoto");
		%>
	</head>
  
	<body>
		<%@ include file="head.jsp" %>
		
		<div id="main">
			<div id="main_top">
				<a href="index.jsp">首页</a>
				&nbsp;&gt;&nbsp;
				用户中心
				
				<span id="ka"></span>
			</div>
		<div class="tab"></div>
			<div id="main_middle" style="width:841px;border:2px solid #e5e5e5;float:right;height:285;margin-top:-0px;">
				<div class="div_title">我的电影订单</div>
				<div id="divMsg" style="font-size: 20px; text-align: center;">
					<b>该用户暂无电影订单!!!</b> <br/><br/><br/>
					<input type="button" value="马上购票   GO!" onclick="javascript:location='index.jsp'"style='height:35px;width:100px;background-color:#ccffff;cursor :pointer'/>
				</div>
				<div id="divTable" style="display: none;">
					<table cellspacing="0" cellpadding="5" width="100%">
						<tr>
							<th width="270px">订单编号</th>
							<th>电影名称</th>
							<th width="100px">场次时间</th>
							<th width="38px">座位号</th>
							<th width="100px">订单时间</th>
							<th width="50px">订单金额</th>
							<th width="50px">订单状态</th>
							<th width="120px">剩余退票时间</th>
							<th width="38px">操作</th>
						</tr>
					</table>
					<div id="divPage" align="center"></div>
				</div>
			</div>
			<div id="money" style="width:841px;border:2px solid #e5e5e5;float:right;height:280px;display:none">
					<p style="font-size:20px">您的余额为：<span id="num" style="font-size:22px;color:orange;"></span></p>
			</div>
			<div id="changePwd" style="display:none;width:841px;border:2px solid #e5e5e5;float:right;height:280px;font-size:25px">
					修改密码<br/><br/><br/>
						<div style="font-size:15px;margin-left:200px;line-height:36px;">
							<p>输入原密码：<input type="password" id="pwd" name="pwd"> <span style="color:red" id="pwdText">请输入原密码，注意区分大小写</span></p>
							<p>输入新密码：<input type="password" id="newpwd" name="newpwd"> <span style="color:red">请输入新密码，密码长度为6-20位数字或者字母</span></p>
							<p>重复输入：&nbsp;&nbsp;&nbsp;<input type="password" id="truepwd" name="truepwd"> <span style="color:red">确认密码！</span></p>
							<p><input type="submit" value="确认修改" onclick="updatePwd()" style="margin-left:180px;"></p>
						</div>
				</div>
			
			<div id="edit_data"  style="width:841px;border:2px solid #e5e5e5;float:right;height:300px;display:none;">
				<div id="imgPhoto" style="width:250px;border-right:2px solid #e5e5e5;height:300px;float:left;">
					点击修改头像：
					<br/><br/>
					<div style="text-align:center;">
						<a title="修改头像"  onclick="javascript:$('#file').click();">
							<img  src="<%= adressPhoto%>" style="border:1px solid #ccc; background-size:cover; background-position:center;width:50%;height:175px;" />
						</a>
					</div>
					<br/><p style="opacity:40;">&nbsp;&nbsp;&nbsp;&nbsp;支持后缀为：BMP、JPG、JPEG、PNG;</p>
				</div>
				<div style="font-size:15px;line-height:36px;text-align:center;">
				<br/>
					邮箱：&nbsp;&nbsp;&nbsp;&nbsp;<span  id="emailText"></span><br/>
					用户名：<input type="text" id="name" ><br/>
					性别：&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="gender" value="1">男 <input type="radio" name="gender" value="0">女<br/>
					手机号：<input type="text" id="phone"><br/>
					<input type="submit" value="保存修改" onclick="updateMember()" style="margin-left:150px;"><br/>
				</div>
		</div>
			<div class="design" id="leftcolumn">
					<ul style="border: 2px solid #e5e5e5;float:left;text-align:center;font-size:20px;width:150px;" id="leftlist">
						<li style="width:150px;height:125px;background-image:url(img/web/show.jpg);background-repeat:repeat;" >
							<div style="width:150px;height:75px;" id="memberPhoto">
								<form action="upload" method="post" enctype="multipart/form-data">
									<a title="修改头像"  onclick="javascript:$('#file').click();">
									<img  src="<%= adressPhoto%>" style="border:2px solid #ccc; border-radius:100%; background-size:cover; background-position:center;width:70%;height:75px;margin-top:15px;" />
									</a>
									<input type="file" id="file" name="file" style="display:none" onchange="test()"/>
									<input type="hidden" id="id" name="id">
									<input type="submit" value="上传" style="display:none" id="submit" name="file"/>
								</form>
							</div>
							
						</li>
						
						<li id="myTicket"><a  title="我的订单"  onclick="myTicket()">
			我的订单			</a><a style="color:white;font-size:18px;float:right;cursor:default">&gt;</a></li>
						<li id="balance"><a  title="我的余额"  onclick="balance()">
			我的余额			</a><a style="color:white;font-size:18px;float:right;cursor:default">&gt;</a></li>
						<li id="data"><a  title="编辑资料" onclick="data()">
			编辑资料		</a><a style="color:white;font-size:18px;float:right;cursor:default">&gt;</a></li>
						<li id="apwd"><a  title="修改密码" onclick="pwd()">
			修改密码		</a><a style="color:white;font-size:18px;float:right;cursor:default">&gt;</a></li>
					</ul>
			</div>
			 
		</div>
		<%@ include file="footer.jsp" %>
		
	</body>
	
</html>
